<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<%@page import="jpa.entities.GitVersionBean"%>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1" %>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

<%@ page import="jpa.service.interfaces.UserManager"%>
<%@ page import="jpa.service.SpringBeansProvider"%>
<%@ page import="jpa.service.UserManagerImpl"%>
<%@ page import="org.springframework.beans.factory.annotation.Autowired"%>
<%@ page import="org.springframework.context.support.ClassPathXmlApplicationContext"%>
<%@ page import="org.springframework.context.ApplicationContext"%>
<%@ page import="jpa.entities.User"     %>
<%@ page import="jpa.daos.UserDao"      %>
<%@ page import="jpa.impls.UserDaoImpl" %>
 
<%!
	UserManager    manager     = SpringBeansProvider.getBean("UserManager"   , UserManager.class);
	GitVersionBean versionBean = SpringBeansProvider.getBean("gitVersionBean", GitVersionBean.class);
%>   

    <c:url value="user/addUser"  var="addUserURL" />

<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
	<title>JPA Hibernate Spring HSQL Example</title>
 	<!-- Bootstrap 3.0 CSS -->	   
	<link rel="stylesheet" type="text/css" media="screen" href='<c:url value="/css/bootstrap_cerulean.css"/>'/>
	<!-- JQuery CSS -->
	<link rel="stylesheet" type="text/css" media="screen" href='<c:url value="/css/jquery-ui-1.10.3.css"/>'/>
	<!-- jqGrid CSS -->
	<link rel="stylesheet" type="text/css" media="screen" href='<c:url value="/jqgrid/css/ui.jqgrid.css"/>'/>	
	<!-- Index CSS -->
	<link rel="stylesheet" type="text/css" media="screen" href='<c:url value="/css/stickyFooter.css"/>'/>
	<link rel="stylesheet" type="text/css" media="screen" href='<c:url value="/css/emp-main.css"/>'/>	
	
	<!-- The Bootstrap   -->
	<script type='text/javascript' src="js/bootstrap.min.js"></script>
	
</head>


<body>
	<div id="wrap">
      <nav id="nav-bar" class="navbar navbar-inverse" role="navigation" style="border-radius:0px;">
 			<div class="navbar-header">
				<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse" id="toggleBtn">
					<span class="sr_only"></span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
				</button>				
				<a class="navbar-brand" href="#" onclick="serverReload();">USER</a>
			</div> 
			
			<div id="empNavbar" class="collapse navbar-collapse navbar-inverse-collapse" data-parent="#nav-bar">
				<ul class="nav navbar-nav">
					<li><a id="mapEngines"  href="#">Map Engines</a></li>
					<li><a id="wmsConfig" href="#">WMS Servers</a></li>
					<li><a id="mapToolConfig" href="#">Map Tools</a></li>
					<li><a id="owfConfig" href="#">Ozone</a></li>
					<li class="dropdown">
						<a href="#" class="dropdown-toggle" data-toggle="dropdown">Network<span class="caret"></span></a>
						<ul class="dropdown-menu">
							<li><a id="proxyConfig" href="#">Proxy Configuration</a></li>
							<li><a id="owfConfig" href="#">OWF-Lib Configuration</a></li>
						</ul>
					</li> 
				</ul>
			</div>
		</nav>
		
		
	<div id=addUserDiv>
	  	<div class="container">
			<div class="col-lg-8" style="padding-left: 0px;">
				<div class="well default_well">
					<form class="form-horizontal">
						<fieldset>
							<legend title="Add additional users">Add Users</legend>
		
							<div class="form-group" title="Enter your desired username">
								<label id="unameLbl" class="col-lg-2 control-label" for="username">Username:</label>
								<div class="col-lg-8 form_row">
									<input id="username" class="form-control lefty coordInput" type="text" placeholder="Username" />
								</div>
							</div>						
							
							<div class="form-group" title="Enter your full name">
								<label class="col-lg-2 control-label" for="name">Name:</label>
								<div class="col-lg-8 form_row">
									<input id="name" class="form-control lefty form_width" type="text" placeholder="full name" />
								</div>
							</div>
								
							<div class="form-group sub-button-group" style="padding-top: 30px;margin-left:0px; position: inherit">
								<button type="button" class="btn btn-success" type="submit" onclick="addUser('${addUserURL}')">Save</button>
								<button type="button" class="btn btn-warning" onclick="updateGoogleMapServerConfigurationGUI()">Reset</button>
							</div>
						</fieldset>
					</form>
				</div>
			</div>
		</div>
	</div>
		
<%-- 		<form method="get" action="user/addUser?username=smatthai&name=stephen">
			UserName: <input type="text" name="username"></input>
			Name: <input type="text" name="name"></input>
			<input type="submit" value="Add"></input>
		</form> --%>
		
		<hr /><br />
		
		<div id="usersListDiv">			
	  		<div class="container">
				<div class="well default_well">
					<div id="userListDiv">
						<table id="userListTbl" class="table table-striped table-hover selectable"></table>
					</div>
				</div>
			</div>
		</div>
		
		
		<hr /><br />
	 	

	  	<div class="container">	 		
			<ol>
				<% for (User user : manager.findAllUsers()) { %>
				<li><%= user %> </li>
				<% } %>
			</ol>		
		</div>
		
	 	
		<div id="push"></div>
	</div>
 	<div id="footer-wrap" class="navbar-inverse"> 		
		<div class="layout-wrap" id="footer">            
				<div id="footer-info">				  
					<div id="footer-blocks" class="navbar-inverse"> 
					<div class="col-md-6">
						 <div id="footer-about-block">
								<div class="footer-block-content">
								   <div data-icon="" id="fbi-about" class="footer-block-icon"><span class="glyphicon glyphicon-info-sign"></span></div>						   
								   <div class="ftb-text" style="line-height: 25px;">
										<div class="footer-tiny-title"><%= versionBean.getName() %></div>
										<div class="footerRevInfo">
											<ul class="nav nav-pills nav-stacked">
						        				<li>        			
						        					<span>Branch: <span id="releaseInfo" class="badge footerBadge"><%= versionBean.getRevision().getBranch() %></span></span>
						        				</li>
						        				<li title="info">        			
						        					<span>Revision: </span><span id="gitDescribe" class="badge footerBadge"><%= versionBean.getRevision().getDescribe() %></span>
						        				</li>
						        				<li title="info">        			
						        					<span>Date: </span><span id="gitDate" class="badge footerBadge"><%= versionBean.getRevision().getBuildTime() %></span>
						        				</li>				        				
						        				<li>        			
						        					<span>Version: </span><span id="appVersion" class="badge footerBadge"><%= versionBean.getVersion() %></span>
						        				</li>
						        			</ul>
						        		</div>
									</div> <!-- fb-text -->
								</div>     
						</div> <!-- footer block -->		
					</div>	
					<div class="clearfix visible-xs"></div>	 
				</div>    
			</div>
		</div>	   		
	</div>
 	
	<div id="loadingDiv" class="modal"></div>
	
	
	<!-- The actual JQuery code -->	
	<script type='text/javascript' src="js/lib/jquery-1.10.2.min.js"></script>	 
	<!-- The JQuery UI code -->
	<script type='text/javascript' src="js/lib/jquery-ui-1.10.3.custom.min.js"/></script>
	<!-- The JQuery blockUI code -->
	<script type='text/javascript' src="js/lib/jquery.blockUI.js"/></script>
	<!-- The jqGrid language file code -->
	<script type="text/javascript" src="jqgrid/js/i18n/grid.locale-en.js"></script>
	<!-- The actual jqGrid code  -->
	<script type="text/javascript" src="jqgrid/js/jquery.jqGrid.min.js"></script>
	
	<!-- The Bootstrap   -->
	<script type='text/javascript' src="js/bootstrap.min.js"></script>
	
	<script type="text/javascript" src="js/table/tableBuilder.js"></script>
	
	<script type='text/javascript'>
		function addUser(userUrl) {
			// get the form values
			var username = $('#username').val();
			var name     = $('#name').val();
			
			$.ajax({
				type: "POST",
				url: 'user/addUser',
				data: "username=" + username + "&name=" + name,
				success: function(response) {
					// remove error notification box 
/* 					emp.$('#error-notification').hide('fast'); */   
 
 					serverReload();
 					
 					insertRecord(response);
					
					if (response.status == "SUCCESS") {
/* 						toggleInfoSuccess("Settings have been successfully saved");						
						if (emp.$('#error-notification').is(":visible")) {
							emp.$('#error-notification').hide('slow');	
						}					 */
						alert(resonse.status);
					} else {
						errorInfo = "<ul>";					
						for (var i = 0; i < response.result.length; i++) {
							errorInfo += "<li>" + "Invalid Field " + "<span>" + response.result[i].field + "</span>: " + response.result[i].code + " : " + response.result[i].defaultMessage + "</li>";
						}
						errorInfo += "</ul>";						
						$('#error-msg').html(errorInfo);
						$('#success-notification').toggle('fast');
						$('#error-notification').show('slow');					
					}					
				},
				error: function(e) {
					alert('Error: ' + e);				
				}								
			});				      		
		} 
		
	  	function serverReload() {
		   location.reload(true);
		};
		
		function insertRecord(record) {
			
		};
		
		initTableHeaders("userListTbl", ["Id","Name","Username"]);
		
		var selectedRow;
		$('tr').not('thead tr').click(function() {
			if (selectedRow) { 
				selectedRow.removeClass('success');
			};
			
			selectedRow = $(this);
			selectedRow.addClass('success');
		});
	</script>
</body>
</html>